<template>
    <div class="page">
        <head-item :title="title"></head-item>
        <div class="flex">
            <v-movie v-for="item of subjects" :key="item.id" :data="item"></v-movie>
        </div>
    </div>
</template>

<script>
import HeadItem from '@/components/Head.vue';
import vMovie from './components/MovieItem.vue'
import Http from '@/api/douban.js'
    export default {
        components:{
            HeadItem,
            vMovie
        },
        data(){
            return {
                title:"",
                subjects:[]
            }
        },
        async mounted() {
            this.title = sessionStorage.getItem('title');
            var {type} = this.$route.params;
            console.log(type);
            let res = await Http.getMovie(type);
            console.log(res);
            this.subjects = res.subjects;
        },
    }
</script>

<style lang="less" scoped>
@top:46px;
    .page{
        padding-top: @top;
    }
    .flex{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        width: 100%;
        padding: 10px;
    }
</style>